import { WebglBase, IBufferInfo } from "./WebglBase";
import { Render } from "./Render";

/*
 * @Author: Snow
 * @Date: 2021-08-31 16:25:55
 * @Description: 
 */
export class WebglMVP extends WebglBase{

    public override initGLSL():void{
        this.vsSource = `
            attribute vec4 aVertexPosition;
            attribute vec4 aVertexColor;

            void main() {
                gl_Position = aVertexPosition;
            }
        `;
    
        this.fsSource = `

            precision mediump float;
            uniform vec4 uColor;

            void main() {
                gl_FragColor = uColor;
            }
        `;
    }

    public override initProgramInfo():void{
        super.initProgramInfo();
        this.programInfo.uniforms.uColor = Render.GL.getUniformLocation(this.shaderProgram,"uColor");
    }


    public override initBuffer():IBufferInfo{
        

      
        return null;
    }

    public override updateMatrix():void{
        
    }


    public override render(ts?:number):void{
        this.rotation += ts - this.ts;
        this.ts = ts;
        const gl = Render.GL;
		gl.clearColor(0.0,0.0,0.0,1.0);
		gl.clearDepth(1.0);
		gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
        gl.enable(gl.DEPTH_TEST);
		gl.depthFunc(gl.LEQUAL);
        
        const settings = {
            top    : 0.5,             // x
            bottom : -0.5,            // x
            left   : -0.5,            // y
            right  : 0.5,             // y
            w: 0.7,

            depth  : 0,               // z
            color  : [1, 0.4, 0.4, 1] // red
        }
        //settings.left = settings.left + (this.rotation / 10);
        //settings.right = settings.right + (this.rotation / 10);
        this.draw(settings);

        const settings1 = {
            top    : 0.9,             // x
            bottom : 0,               // x
            left   : -0.9,            // y
            right  : 0.9,             // y
            w:1.1,
          
            depth  : 0.5,             // z
            color  : [0.4, 1, 0.4, 1] // green
        }
        
        this.draw(settings1);

        const settings2 =  {

            top    : 1,               // x
            bottom : -1,              // x
            left   : -1,              // y
            right  : 1,               // y
            w      : 1.5,             // w - 把这个盒子带回范围内
          
            depth  : -1.5,             // z
            color  : [0.4, 0.4, 1, 1] // blue
        }

        this.draw(settings2);
    }


    public override draw(param?:any):void{
        const gl = Render.GL;
        const settings = param;

        var data = new Float32Array([
            //Triangle 1
            settings.left,  settings.bottom, settings.depth, settings.w,
            settings.right, settings.bottom, settings.depth, settings.w,
            settings.left,  settings.top,    settings.depth, settings.w,
        
            //Triangle 2
            settings.left,  settings.top,    settings.depth, settings.w,
            settings.right, settings.bottom, settings.depth, settings.w,
            settings.right, settings.top,    settings.depth, settings.w,
        ]);
        
        const vPos = gl.createBuffer();
        gl.bindBuffer(gl.ARRAY_BUFFER,vPos);
        gl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);

        gl.useProgram(this.shaderProgram);
        
        gl.uniform4fv(this.programInfo.uniforms.uColor, settings.color);

        gl.enableVertexAttribArray(this.programInfo.attributes.aVertexPosition);
        gl.vertexAttribPointer(this.programInfo.attributes.aVertexPosition, 4 ,gl.FLOAT,false,0,0);


        gl.drawArrays(gl.TRIANGLES,0,6);
    }
}
